<template>
  <el-table :summary-method="getSummaries" show-summary :data="tableData" :span-method="objectSpanMethod" border class="statistics-list">
    <el-table-column prop="countyName" align="center" label="区/县">
      <template slot-scope="{row}">
        <span class="to-link" @click="goPersonnel(row,'1')">{{ row.countyName }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="enterpName" align="center" label="企业名称">
      <template slot-scope="{row}">
        <span class="to-link" @click="goPersonnel(row,'2')">{{ row.enterpName }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="surveyName" align="center" label="人员类型">
      <template slot-scope="{row}">
        <span class="to-link" @click="goPersonnel(row,'3')">{{ row.surveyName }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="surveyTypeAccountCount" align="center" label="人数(个)" />
    <el-table-column prop="buildAccountCount" align="center" label="施工中人数(个)" />
  </el-table>
</template>

<script>
import { regionStatisticsExport } from '@/api/statisticalAnalysis/statistics/personal'
import { dataMethod } from '@/utils/tableObjectSpanMethod.js'
export default {
  name: 'Home',
  props: {
    tableData: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      regionList: [],
      spanObj: {}
    }
  },
  watch: {
    tableData() {
      this.spanObj = dataMethod(this.tableData, ['countyName', 'enterpName', 'surveyName'])
      this.getCityList()
    }
  },
  created() {
    this.spanObj = dataMethod(this.tableData, ['countyName', 'enterpName', 'surveyName'])
    this.getCityList()
  },
  methods: {
    getCityList() {
      const regionList = this.tableData.map(item => {
        const { countyName, county } = item
        return { countyName, county }
      })
      this.regionList = this.deteleObject(regionList)
    },
    deteleObject(arr) {
      const temp = {}	//	用于name判断
      const result = [] // 最后的新数组
      arr.map((item, index) => {
        if (!temp[item.county]) {
          result.push(item)
          temp[item.county] = true
        }
      })
      return result
    },
    // 表格导出
    async exportData() {
      const tableHeader = [
        {
          'key': 'countyName',
          'label': '区/县'
        },
        {
          'key': 'enterpName',
          'label': '企业名称'
        },
        {
          'key': 'surveyName',
          'label': '人员类型'
        },
        {
          'key': 'surveyTypeAccountCount',
          'label': '人数(个)'
        },
        {
          'key': 'buildAccountCount',
          'label': '施工中人数(个)'
        }
      ]
      const res = await regionStatisticsExport(tableHeader)
      if (!res) return
      this.downloadFileFlow(res, '人员区域统计信息')
    },
    // 表格合计
    getSummaries(param) {
      const { data } = param
      const sums = []
      const countyAccountCount = data.reduce((prev, item) => item.surveyTypeAccountCount + prev, 0)
      const buildAccountCount = data.reduce((prev, item) => item.buildAccountCount + prev, 0)
      sums.push('总计', '', '', countyAccountCount, buildAccountCount)
      return sums
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      // console.log({ row, column, rowIndex, columnIndex },'合并表格')
      // 列合并
      const _row = this.spanObj[column.property] ? this.spanObj[column.property][rowIndex] : 1
      const _col = _row > 0 ? 1 : 0
      return {
        rowspan: _row,
        colspan: _col
      }
    },
    goPersonnel(row, flag) {
      const { county, countyName, surveyType, enterpName } = row
      let query = {}
      if (flag === '1') {
        query = { county, countyName }
      } else if (flag === '2') {
        query = { county, countyName, enterpName }
      } if (flag === '3') {
        query = { county, countyName, surveyType, enterpName }
      }
      this.$router.push({
        name: 'statisticsList-personal',
        params: { cityOptions: this.regionList, type: '2', currentTable: '1', ...query }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
